<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>vue生命周期</title>
		<script src="../vue@3.2.23.js"></script>
	</head>
	<body>
		<div id="app">{{title}}</div>
	</body>
	<script>
		//结构赋值
		const {createApp}=Vue
		const app=createApp({
			data(){
				return {
					title:'你好vue',
				}
			},
			methods:{
				sayHi(){
					console.log("hi")
				}
			},
			//创建实例之前
			beforeCreate() {
				console.log("beforeCreate");
			},
			//创建实例之后
			created(){
				console.log("created");
			},
			//挂载之前
			beforeMount(){
				console.log("beforeMount");
			},
			//挂载之后
			mounted(){
				console.log("mounted");
			},
			//卸载之后
			unmounted() {
				console.log("unmounted");
			},
			//更新之前
			beforeUpdate() {
				console.log("beforeUpdate");
			},
			//更新之后
			updated(){
				console.log("updated");
			}
		})
		//创建实例
		const vm=app.mount("#app")
	</script>
</html>